<template>
	<view>
		<tt-bar leftIcon="icon-back" title="设置"></tt-bar>
		<view class="setList">
			<view class="row tapBg" @tap="toNewPage" data-url="editInfo">
				<text class="setLabel">修改个人信息</text>
				<text class="iconfont icon-right"></text>
			</view>
			<view class="row tapBg" @tap="toNewPage" data-url="editTel">
				<text class="setLabel">修改手机号</text>
				<text class="iconfont icon-right"></text>
			</view>
			<view class="row tapBg" @tap="toPage" data-url="aboutUs">
				<text class="setLabel">关于找培训</text>
				<text class="iconfont icon-right"></text>
			</view>
			<view class="row tapBg" @tap="clearCatch" >
				<text class="setLabel">清除缓存</text>
				<text class="listRight2">{{catchSize}}</text>
			</view>
			<view class="row tapBg" @tap="checkUpData">
				<text class="setLabel">检查更新</text>
				<!-- <text class="listRight">有新版本</text> -->
				<!-- <text class="iconfont icon-right"></text> -->
			</view>
			<view class="row tapBg" @tap="toNewPage" data-url="feedback">
				<text class="setLabel">意见反馈</text>
				<text class="iconfont icon-right"></text>
			</view>
		</view>
		<view class="btnBox">
			<button class="tapOpt" @tap="logOut" v-if="isLogin">退出登录</button>
		</view>
		<updateModal ref="upModal"></updateModal>
		<downLoading></downLoading>
	</view>
</template>

<script>
	import COMM from "@/common/common.js";
	import ttBar from "@/components/ttBar/ttBar.vue";
	import downLoading from "@/components/downLoding/downLoding.vue";
	import {
		mapState,
		mapGetters,
		mapMutation,
		mapActions
	} from "vuex";
	export default {
		components: {
			ttBar,
			downLoading
		},
		computed:{
			...mapState({
				isLogin:state=>state.user.isLogin,
				
			})
		},
		data() {
			return {
				prs:0,
				isShow:false,
				catchSize:'0 KB',
				downFileArr:[],
			};
		},
		methods:{
			toNewPage(e){
				if(this.isLogin){
					this.toPage(e)
				}else{
					this.toPage('login')
				}
			},
			logOut(){
				if(this.isLogin){
					this.$store.dispatch("apiLogOut",{
						token:uni.getStorageSync("token")
					})
					.then(res=>{
						this.$store.dispatch("timLogOut").then(()=>{
							
						})
						this.toPage("index")
					})
				}else{
					uni.showToast({
						title: '您当前还未登录',
						icon: 'none'
					});
				}
				
			},
			getCatch(){
				// #ifdef APP-PLUS
				this.$store.dispatch("getDownloadListSize").then(res=>{
					this.catchSize=res
					console.log(res);
				})
				uni.getSavedFileList({
					success: (res) => {
						this.downFileArr=res.fileList
					},
					fail: () => {
						console.log("获取下载目录文件总大小失败");
					}
				})
				// #endif
				
			},
			clearCatch(){
				uni.clearStorage();
				COMM.clearDownLoadFile(this.downFileArr);
				this.getCatch();
			},
			checkUpData(){
				// #ifdef APP-PLUS
				this.$store.dispatch("getNowAppInfo")
				this.$store.dispatch("apiGetUpdateInfo").then(res=>{
					this.$store.dispatch("checkUpDate").then(res=>{
						uni.showToast({
							title: '当前已是最新版本',
							icon: 'none'
						});
					});
				})
				// #endif
				
			}
		},
		onLoad() {
			this.getCatch();
		},
		onPullDownRefresh() {
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1500)
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f6f6f6;
	}

	.setList {
		margin-top: 26upx;
		padding: 0 18upx;
		display: flex;
		flex-direction: column;

		.row {
			display: flex;
			align-items: center;
			background-color: #FFFFFF;
			padding: 50upx 40upx 50upx 50upx;
			border-radius: 16upx;
			box-shadow: 0rpx 3rpx 17rpx 0rpx rgba(201, 202, 208, 0.15);
			margin-bottom: 10upx;

			.setLabel {
				font-size: 32rpx;
				color: #202932;
				flex: 1;
			}

			.iconfont {
				color: #908bad;
			}

			.listRight {
				font-size: 28rpx;
				color: #ff7d27;
			}
			.listRight2{
				font-size: 28upx;
				color: #202932;
			}
		}
	}

	.btnBox {
		position: absolute;
		bottom: 50upx;
		width: 100%;
		left: 0;
		padding: 0 98upx;

		button {
			height: 88rpx;
			background-color: #ffb423;
			border-radius: 44rpx;
			border-radius: 44upx;
			border: none;
			line-height: 88upx;
			color: #FFFFFF;
			font-size: 32upx;
		}

		button:after {
			border: none;
		}
	}
</style>
